<% include ../../header.html  %>

<div class="col-sm-8">
    <form class="form-horizontal" role="form">
        <div class="form-group ">
            <label  class="col-sm-1 control-label">文章标题</label>
            <div class="col-sm-11">
                <input type="hidden" id="id" value="<%=article.id%>">
                <input type="text" class="form-control" id="title"
                       placeholder="请输入名字" value="<%=article.title%>"  required>
            </div>
        </div>
        <div class="form-group ">
            <label  class="col-sm-1 control-label">文章简介</label>
            <div class="col-sm-11">
                <textarea rows="5" cols="20" id="brief" class="form-control" placeholder="请输入文章简介" required><%=article.brief%></textarea>
            </div>
        </div>
        <div class="form-group ">
            <label  class="col-sm-1 control-label">文章分类</label>
            <div class="col-sm-11">
                <select  class="form-control" id="tagid">
                    <option value="">请选择标签分类</option>
                    <% for (var i=0;i< tagList.length;i++) { %>

                        <option value="<%=tagList[i].id%>" <% if (article.tag.id == tagList[i].id) { %> selected  <% } %> > <%=tagList[i].tagname%> </option>

                    <% } %>
                </select>

            </div>
        </div>
        <div class="form-group">
            <label  class="col-sm-1 control-label">文章内容</label>
            <div class="col-sm-11">
                <div class="ar-toolbox">
                    <button id="ar-new" type="button" class="btn btn-primary"><strong>新建</strong>&nbsp;<i class="glyphicon glyphicon-plus"></i></button>
                    <button id="ar-show-editor" type="button" class="btn btn-info"><strong>编辑</strong>&nbsp;<i class="glyphicon glyphicon-edit"></i></button>
                    <button id="ar-show-html" type="button" class="btn btn-info"><strong>预览</strong>&nbsp;<i class="glyphicon glyphicon-eye-open"></i></button>
                </div>
                <div id="ar-editor" class="col-sm-12 col-xs-12 ar-editor-zone" contentEditable>
                    <%=article.content%>
                </div>

                <div class="col-sm-12 col-xs-12 ar-editor-zone">
                    <article id="ar-preview" class="markdown-body"></article>
                </div>

                <div class="ar-toolbox" style="margin-top: 440px">
                    <button id="destroy-buffer" type="button" class="btn btn-disabled"><strong>Destroy</strong>&nbsp;<i class="glyphicon glyphicon-remove"></i></button>
                    <button id="download-content" type="button" class="btn btn-success ar-toolbox-right"><strong>保存</strong>&nbsp;<i class="glyphicon glyphicon-save"></i></button>
                </div>
            </div>
        </div>

    </form>
</div>

<% include ../../footer.html  %>

<script type="text/javascript">

    $(document).ready(function(){

        var editor = ace.edit("ar-editor");

        $("#download-content").click(function(){
            //alert(editor.getValue());
            var id = $("#id").val();
            var title = $("#title").val();
            var brief = $("#brief").val();
            var tagid = $("#tagid").val();
            $.ajax({
                url:'/article/updatearticledone',
                type:"post",
                dataType:"json",
                data:{
                    id : id,
                    content : editor.getValue(),
                    title : title,
                    brief : brief,
                    tagid : tagid
                },
                success:function(data){

                    layer.msg(data.msg, {

                        time: 2000 //20s后自动关闭

                    },function(){

                        window.location.reload()
                    });
                },
                error:function(error){

                    layer.msg(data.msg);
                }

            });
        });
    });

</script>